<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta id="vp" name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1, user-scalable=no">
  <script type="text/javascript">
    var rem = document.documentElement.clientWidth/6.4;
    document.getElementsByTagName("html")[0].style.fontSize = rem+"px";
  </script>
  <title>微信朋友圈</title>
  <link rel="stylesheet" href="css/style.css" media="screen" title="no title">
  <link rel="stylesheet" href="font/iconfont.css" media="screen" title="no title">
  <script src="js/jquery-1.12.4.js"></script>
</head>
<body>
  <div class="wrapper">
    <header class="header">
      <span id="retu" class="iconfont">&#xe601;</span>
      <span>朋友圈</span>
      <span id="photo" class="iconfont">&#xe603;</span>
    </header>
    <div class="container">
      <div class="conHead">
        <img src="img/pic3.jpg" alt="相册封面" id="photoAlbum"/>
        <span id="name">。。。。。。。</span>
        <img src="img/pic1.jpg" alt="头像" id="headPor">
      </div>
      <div class="conMain">
        <section>
          <div class="seHead">
            <a href="#"><img src="img/pic2.jpg" alt="朋友头像" /></a>
          </div>
          <div class="seText">
                <div class="userI">
                  <span class="usName">郭青</span>
                </div>
                <div class="fon">
                  这个世界很美好！！！！
                </div>
                <div class="pics">
                    <div>
                        <a href="img/s3.jpg" data-size="800x1142">
                            <img src="img/s3_m.jpg" />
                        </a>
                    </div>
                    <div>
                        <a href="img/s4.jpg" data-size="800x1142">
                            <img src="img/s4_m.jpg" />
                        </a>
                    </div>
                    <div>
                        <a href="img/s5.jpg" data-size="800x1142">
                            <img src="img/s5_m.jpg" />
                        </a>
                    </div>
                </div>
                <div class="time">
                  <span>刚刚</span>
                  <span>点赞</span>
                </div>
          </div>

        </section>
        <section>
          <div class="seHead">
            <a href="#"><img src="img/pic2.jpg" alt="朋友头像" /></a>
          </div>
          <div class="seText">
                <div class="userI">
                  <span class="usName">郭青</span>
                </div>
                <div class="fon">
                  这个世界很美好！！！！
                </div>
                <div class="pics">
                    <div>
                        <a href="img/s3.jpg" data-size="800x1142">
                            <img src="img/s3_m.jpg" />
                        </a>
                    </div>
                    <div>
                        <a href="img/s4.jpg" data-size="800x1142">
                            <img src="img/s4_m.jpg" />
                        </a>
                    </div>
                    <div>
                        <a href="img/s5.jpg" data-size="800x1142">
                            <img src="img/s5_m.jpg" />
                        </a>
                    </div>
                </div>
                <div class="time">
                  <span>6小时前</span>
                  <span>点赞</span>
                </div>
          </div>
        </section>
        <section>
          <div class="seHead">
            <a href="#"><img src="img/pic2.jpg" alt="朋友头像" /></a>
          </div>
          <div class="seText">
                <div class="userI">
                  <span class="usName">郭青</span>
                </div>
                <div class="fon">
                  这个世界很美好！！！！
                </div>
                <div class="pics">
                    <div>
                        <a href="img/s3.jpg" data-size="800x1142">
                            <img src="img/s3_m.jpg" />
                        </a>
                    </div>
                    <div>
                        <a href="img/s4.jpg" data-size="800x1142">
                            <img src="img/s4_m.jpg" />
                        </a>
                    </div>
                    <div>
                        <a href="img/s5.jpg" data-size="800x1142">
                            <img src="img/s5_m.jpg" />
                        </a>
                    </div>
                </div>
                <div class="time">
                  <span>8小时前</span>
                  <span>点赞</span>
                </div>
          </div>
        </section>
      </div>

    </div>
  </div>
</body>
</html>
